/**
 * Created by tanbingqin on 2021/1/15.
 */
import { messages, deepFullCopy } from "share/common";
import React from "react";
import { connect } from "react-redux";
import { message, Modal, Button, Row, Col } from "antd";
import travelService from "containers/request/travel-request/travel.service";
import errorMessage from "share/errorMessage";
import "styles/approve/approve-check-tips.scss";
import Condition from "components/condition";
const If = Condition.If;
import moment from "moment";
import "styles/approve/approve-check-tips.scss";
import "styles/request/btns/ticket-booking.scss";
import requestUtil from "containers/request/slide/request-util";

class RiskCityModal extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      modalVisible: false,
      travelErrorList: [],
    };
  }

  componentDidMount() {
    const { loginCompany } = this.props;
    //读取是否风险地区提示开关，这个是租户级配置
    //单据头结束日期小于提交日期时不校验
    if (loginCompany.riskAreaAttention && !this.checkDate()) {
      this.processRiskCity();
    }
  }

  //校验单据头结束日期是否小于提交日期
  checkDate = () => {
    const { info } = this.props;
    if (info.travelApplication && info.travelApplication.endDate) {
      return moment(info.travelApplication.endDate).isBefore(moment(info.submittedDate), "day");
    } else {
      return true; //返回true 不走提示
    }
  };

  processRiskCity = () => {
    travelService
      .riskCityCheck(this.props.info.applicationOID)
      .then((res) => {
        let riskCity = res.data || {};
        let travelErrorList = [];
        if (riskCity && riskCity.cityRiskDetails && riskCity.cityRiskDetails.length) {
          let content = requestUtil.getCityRiskContent(riskCity);
          travelErrorList.push({
            type: "WARNING",
            title: riskCity.title,
            message: riskCity.message,
            content: content,
          });
          this.setState({ travelErrorList, modalVisible: true });
        }
      })
      .catch((err) => {
        errorMessage(err.response);
      });
  };

  closeModal = () => {
    this.setState({ modalVisible: false });
  };

  render() {
    const { modalVisible, travelErrorList } = this.state;
    return (
      <div>
        <Modal
          title={messages("common.info") /*提示*/}
          visible={modalVisible}
          onCancel={this.closeModal}
          maskClosable={false}
          destroyOnClose={true}
          width={540}
          footer={[
            <Button key="close" type="primary" onClick={this.closeModal}>
              {messages("request-1.key948") /*我知道了*/}
            </Button>,
          ]}
          wrapClassName="approve-check-tips-modal"
        >
          <div className="error-list">
            {travelErrorList.map((item) => {
              return (
                <div className="error-item-wrapper">
                  <div className="error-item">
                    <span className="title">{item.title}</span>
                    <div className={`title-base ${item.type === "ERROR" ? "title-error" : "title-warning"}`} />
                  </div>
                  <div>{item.message}</div>
                  {item.content}
                </div>
              );
            })}
          </div>
        </Modal>
      </div>
    );
  }
}

RiskCityModal.propTypes = {
  info: React.PropTypes.object, //申请单详情
};

RiskCityModal.defaultProps = {
  info: {},
};

function mapStateToProps(state) {
  return {
    loginCompany: state.login.loginCompany,
  };
}

export default connect(mapStateToProps)(RiskCityModal);
